<!DOCTYPE html>
<html lang="en" class="fullscreen-bg" xmlns:th="http://www.thymeleaf.org">
<head th:replace="common::head('角色授权')" >
<meta charset="UTF-8">
</head>
<body>
    <div class="panel">
   
     <div class="panel-body">
      <a>角色授权</a>
      <hr>
         <form action=""  role="form"  class="form">
         <div class="row">
             <!--循环一级权限-->
               <div class="col-md-6"  th:each="p:${map.permissions}"  style="height:60px;">
                   <div class="checkbox checkbox-success"  th:if="${p.children != null}" >
		                        <input type="checkbox"  th:checked="${#lists.contains(map.myPermissionids, p.id)}"  class="all styled"  th:id="|m1${p.id}|" th:value="${p.id}">
		                        <label th:for="|m1${p.id}|"  th:text="${p.name}" > Inline One </label>
                   </div>
                   <!--循环二级权限-->
                   <th:block  th:if="${p.children != null}"  th:each="c:${p.children}" >
                    <div  class="checkbox checkbox-inline checkbox-success"    >
						     <input type="checkbox"  class="send  styled" th:checked="${#lists.contains(map.myPermissionids, c.id)}"   th:id="|m2${c.id}|"   th:value="${c.id}" >
						     <label th:for="|m2${c.id}|"  th:text="${c.name}"> Inline One </label>
                      </div>
                   </th:block>
            
            </div>
		</div>         
            <div class="form-group text-righ">						    
						      <button type="submit"   class="submit btn btn-primary pull-right ">授权</button>
						 </div>
						 
         </form>
       </div>
     </div>
     <script type="text/javascript" th:inline="javascript">
    
		     function changeState(el) {
		         if (el.readOnly) el.checked=el.readOnly=false;
		         else if (!el.checked) el.readOnly=el.indeterminate=true;
		     }

           $(".all").on("click",function(){
        	       var ischeckd=$(this).prop("checked");        	      
                   var childs= $(this).parent("div").nextAll("div").children("input"); 	 
                   childs.prop('checked',ischeckd);                                                        
               });
           
        $(".checkbox-inline input[checkbox]").on("click",function(){  
                	     var allNum=$(this).parent(".checkbox-inline").children("input").length;
                	     var checkedNum=$(this).parent(".checkbox-inline").find("input:checked").length; 
                	     alert(allNum +"  "+ checkedNum);
                	     $(this).parent("label").parent("div").prev("label").children("input").prop("checked",checkedNum>0?true:false);
          });
        
        $(".form").on("submit",function(e){
        	e.preventDefault();
        	var uid = new Array();
        	var mid = new Array();
        	var val=$(":checked");
        	val.each(function(i){
        		uid[i] = $(this).val();
        		mid[i]=$(this).attr("title");
			  });
        	
        	var new_arr=[];
        	for(var i=0;i<mid.length;i++) {
        	　　var items=mid[i];
        	　　//判断元素是否存在于new_arr中，如果不存在则插入到new_arr的最后
        	　　if($.inArray(items,new_arr)==-1) {
        	　　　　new_arr.push(items);
        	　　}
        	}
        	var uids = uid.join(",");
        	var mids=new_arr.join(",");
        	var rid = [[${map.rid}]];
        	rid=parseInt(rid);
        	var param={roleId:rid,permissionIds:uids};

        	$.ajax(
    	      		{  type:"post",
    	      		   url: '/role/addPermission',
    	      		   data:param,
    	      		   success: function(data){	     	      			
    	       		     if(!data.success){
     	       		    	toastr.warning(data.msg);  
                            setTimeout(function(){
                                window.location.reload();
                             },2000);
     	       		       }
     	       		    else{
     	       		    	toastr.success(data.msg);
                           setTimeout(function(){
                               window.location.href = "/role/index";
                            },2000);
     	       		      } 				 
    	      		   }});
        	
           });
        
       
     </script>
</body>
</html>